<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://java.sun.com/jsf/html">

    <body>

        <ui:composition template="./../../WEB-INF/templates/MainTemplate.xhtml">
            
            <ui:define name="content">
                <p:panel styleClass="leftColumnPanel noMargin noPadding noBorder">
                    <h:form id="datosEnvio">
                        <p:growl autoUpdate="true" life="4000" id="nuevoEnvioGrowl"></p:growl>
                        <p:panel id="datosEnvioPanel">
                            <h:panelGrid columns="4">
                                <p:outputLabel for="almacenEnvio" value="#{messages.AlmacenEnvio}"></p:outputLabel>
                                <p:selectOneMenu  converter="#{almacenConverter}" id="almacenEnvio" required="true" value="#{nuevoEnvioTraspasoMercanciaLogisticaBean.nuevoEnvio.almacenEnvio}" label="#{messages.AlmacenEnvio}">
                                    <f:selectItem itemLabel="#{messages.SeleccionaAlmacen}" itemValue="" />  
                                    <f:selectItems value="#{resourcesBean.almacenes}" var="almacen" itemLabel="#{almacen.descripcion}" itemValue="#{almacen}"></f:selectItems>
                                    <p:ajax></p:ajax>
                                </p:selectOneMenu>

                                <p:outputLabel for="almacenDestino" value="#{messages.AlmacenDestino}"></p:outputLabel>
                                <p:selectOneMenu converter="#{almacenConverter}" id="almacenDestino" required="true" value="#{nuevoEnvioTraspasoMercanciaLogisticaBean.nuevoEnvio.almacenDestino}" label="#{messages.AlmacenDestino}">
                                    <f:selectItem itemLabel="#{messages.SeleccionaAlmacen}" itemValue="" />  
                                    <f:selectItems value="#{resourcesBean.almacenes}" var="almacen" itemLabel="#{almacen.descripcion}" itemValue="#{almacen}"></f:selectItems>
                                    <p:ajax></p:ajax>
                                </p:selectOneMenu>

                                <p:outputLabel for="identificador" value="#{messages.Tracking}"></p:outputLabel>
                                <p:inputText id="identificador" required="true" value="#{nuevoEnvioTraspasoMercanciaLogisticaBean.nuevoEnvio.identificadorEnvio}">
                                    <p:ajax></p:ajax>
                                </p:inputText>

                                <p:outputLabel for="comentarios" value="#{messages.Comentarios}"></p:outputLabel>
                                <p:inputTextarea id="comentarios" value="#{nuevoEnvioTraspasoMercanciaLogisticaBean.nuevoEnvio.comentarios}">
                                    <p:ajax></p:ajax>
                                </p:inputTextarea>
                            </h:panelGrid>
                            <p:commandButton value="#{messages.Guardar}" disabled="#{!nuevoEnvioTraspasoMercanciaLogisticaBean.puedeGuardar}" action="#{nuevoEnvioTraspasoMercanciaLogisticaBean.guardar}"></p:commandButton>
                        </p:panel>
                    </h:form>
                </p:panel>
                <p:panel styleClass="rightColumnPanel noMargin noPadding noBorder">
                    <h:form id="pistolaForm">
                        <p:panel id="panelCodigoBarras" styleClass="noBorder" widgetVar="panelCodigoBarras">
                            <f:facet name="header">#{messages.Productos}</f:facet>
                            <p:focus for="codigoBarrasInput"></p:focus>
                            <p:outputLabel for="codigoBarrasInput" value="#{messages.CodigoBarras}"></p:outputLabel>
                            <p:inputText id="codigoBarrasInput" value="#{nuevoEnvioTraspasoMercanciaLogisticaBean.codigoBarras}"></p:inputText>
                            <p:commandButton value="#{messages.Add}"  update=":pistolaForm:panelCodigoBarras :productosTicketForm:datosProductos :datosEnvio:datosEnvioPanel" actionListener="#{nuevoEnvioTraspasoMercanciaLogisticaBean.onCodigoBarrasCambiado()}"></p:commandButton>
                        </p:panel>
                    </h:form>
                    
                    <h:form id="productosTicketForm">
                        <p:panel id="datosProductos">
                            <f:facet name="header">#{messages.ProductosElegidos}</f:facet>
                            <p:dataTable emptyMessage="#{messages.NoProductosVentaElegidos}" var="lineaEnvio" value="#{nuevoEnvioTraspasoMercanciaLogisticaBean.lineaEnvioTraspasoMercanciaList}">
                                <p:column sortBy="#{lineaEnvio.productoTalla.producto.descripcion}" filterBy="#{lineaEnvio.productoTalla.producto.descripcion}" filterMatchMode="contains" headerText="#{messages.Producto}">
                                    <h:outputText value="#{lineaEnvio.productoTalla.producto.descripcion}"></h:outputText>
                                </p:column>
                                <p:column sortBy="#{lineaEnvio.productoTalla.producto.color}" filterBy="#{lineaEnvio.productoTalla.producto.color}" filterMatchMode="contains" headerText="#{messages.Color}">
                                    <h:outputText value="#{lineaEnvio.productoTalla.producto.color}"></h:outputText>
                                </p:column>
                                <p:column sortBy="#{lineaEnvio.productoTalla.talla.descripcion}" filterBy="#{lineaEnvio.productoTalla.talla.descripcion}" filterMatchMode="contains" headerText="#{messages.Talla}">
                                    <h:outputText value="#{lineaEnvio.productoTalla.talla.descripcion}"></h:outputText>
                                </p:column>
                                <p:column headerText="#{messages.Cantidad}">
                                    <p:inputText styleClass="pedidoInput" value="#{lineaEnvio.cantidad}">
                                        <p:ajax event="change" update=":datosEnvio:datosEnvioPanel"></p:ajax>
                                    </p:inputText>
                                </p:column>
                            </p:dataTable>
                        </p:panel>                    
                    </h:form>
                </p:panel>
            </ui:define>
        </ui:composition>
    </body>
</html>
